<template>
  <view class="content">
    <head-box></head-box>
    <view class="wq_con tab-botton">
      <view class="banner">
        <image src="/static/img/rightshelping.png" mode="aspectFill"></image>
      </view>
      <view v-for="(tabItem, tabIndex) in list" :key="tabIndex">
        <view class="quntuanListPage-main-header">
          <div class="quntuanListPage-main-title">{{ tabItem.name }}</div>
        </view>
        <view class="box_list">
          <view
            class="item"
            v-for="(item, index) in tabItem.orderList"
            :key="index"
            :data-id="item.id"
          >
            <view @tap="onGetSceneLogo(item.id, item)">
              <view><image :src="item.sceneLogo" mode="aspectFit"></image></view>
              <view
                ><text>{{ item.sceneName }}</text></view
              >
            </view>
          </view>
        </view>
      </view>
    </view>
    <tabs-box></tabs-box>
  </view>
</template>

<script>
import { gpSceneList, getGroupUrl, getDictItems, postDayVisitsUrl } from '@/common/request.js'
import { agetGroupUrls, getImage } from '@/common/type'
export default {
  data() {
    return {
      list: [],
      list_1: [],
      list_2: [],
      list_3: [],
      list_4: [],
    }
  },
  onLoad() {
    this.getNewsList()
  },
  onShow() {
    // #ifdef H5
    console.log('分享')
    this.$wxSetShare()
    // #endif
  },
  methods: {
    //获取地址列表信息
    getNewsList() {
      var that = this
      let params = {}
      getDictItems(params, 'scene_type').then((res) => {
        if (res.success) {
          res.result.forEach((p) => {
            params = { sceneType: p.value, sceneHidden: '2' }
            const list = []
            gpSceneList(1000, 1, params).then((res) => {
              if (res.success) {
                res.result.records.forEach((ele) => {
                  list.push({
                    id: ele.id,
                    sceneName: ele.sceneName,
                    sceneLogo: getImage(ele.sceneLogo),
                    sceneCode: ele.sceneCode,
                  })
                })
              }
            })
            that.list.push({ value: p.value, name: p.text, orderList: list })
          })
        }
      })
    },
    //进入相应的链接地址
    onGetSceneLogo(id, item) {

      const { sceneName, sceneCode } = item
      const list = ['惠民直达', '一键入群', '教育培训', '维权帮扶', '交友联谊']
      this.$clickGpScenePv(sceneCode)
      if (list.includes(sceneName)) {
        postDayVisitsUrl('', sceneName, 1)
      }
      const sceneNameList = ['志愿汇', '青训营'] //要判断身份证之类的
      if (sceneNameList.includes(sceneName)) {
        this.getUserInfoValue(result=>{
          if(result){
            return agetGroupUrls(getGroupUrl, id, sceneName)
          }
        })

      } else {
        return agetGroupUrls(getGroupUrl, id, sceneName)
      }
    },
  },
}
</script>

<style lang="scss">
.content {
  height: 100vh;
  margin-bottom: 120rpx;
  .wq_con {
    padding: 30rpx;
    .banner {
      width: 100%;
      height: 280rpx;
      margin-bottom: 60rpx;
      image {
        width: 100%;
        height: 100%;
        border-radius: 10rpx;
      }
    }
    .quntuanListPage-main-title {
      font-size: 32rpx;
      color: #333;
      font-weight: 600;
      border-left: 6rpx solid #0071fc;
      background-image: linear-gradient(left, #eff6ff, #ffffff);
      padding-left: 20rpx;
    }

    .box_list {
      display: flex;
      display: -webkit-flex;
      -webkit-box-pack: justify;
      flex-direction: row;
      flex-wrap: wrap;
      padding: 50rpx 0;
      .item {
        width: 25%;
        text-align: center;
        padding: 20rpx 0;
        image {
          width: 70rpx;
          height: 70rpx;
        }
        text {
          font-size: 24rpx;
        }
      }
    }
  }
}
</style>
